<template>
  <div class="groupchatview-container">
    <!--聊天页面对象头部-->
    <chatviewheader :name='`${singleGroupInfo.name}(${singleGroupInfo.affiliations_count})`' :action='`groupmore/${id}`'></chatviewheader>
    <!--聊天对话组件-->
    <msgcomp
    :showChoose='chageMsg'
    :chatHeadicon='""'
    :msgList='getCurrentGroupChat'
    ></msgcomp>
    <!-- 发送 -->
    <chatsend
    @chagemsg='chageMsgFun'
    :type='"groupchat"'
    ></chatsend>
  </div>
</template>

<script>
  import chatviewheader from '../chatview/ChatViewHeader'
  import msgcomp from '../chatview/MsgComp'
  import chatsend from '../chatview/ChatSend'
  import {mapState, mapGetters} from 'vuex'
  export default {
    data() {
      return {
        chageMsg: false,
        id: this.$route.params.id,
        singleGroupInfo: {}
      }
    },
    components: {
      chatviewheader,
      msgcomp,
      chatsend
    },
    created() {
      console.log(this.id)
      this.initc()
    },
    mounted() {
      this.init()
    },
    computed: {
      ...mapState(['groupInfo']),
      ...mapGetters(['getCurrentGroupChat'])
    },
    methods: {
      // 初始化你函数
      init() {
        this.$immui.init()
      },
      initc() {
        // console.log(this.id)
        let option = this.groupInfo.filter(f => f.id === this.id) || []
        this.singleGroupInfo = option[0]
      },
      chageMsgFun(flag) {
        this.chageMsg = flag
      }
    }
  }
</script>

<style lang='scss' scoped>
  /*容器样式*/
.groupchatview-container{
  z-index: 12;
}
</style>
